<template>
    <div class="swiper-container">
      <div class="swiper-wrapper">
          <div class="swiper-slide">
            <a href="http://m.suning.com?snstoreTypeCode=1002&amp;extId=0_0&amp;snstoreId=http://lspre-snxd.cnsuning.com/activity/getCoupon.html?actCode:Edduw7"><img src="//uimgpre.cnsuning.com/uimg/cms/img/147460063032849318.jpg" alt="广告5"></a>
          </div>
          <div class="swiper-slide">
            <a href="http://m.suning.com?snstoreTypeCode=1002&amp;extId=0_0&amp;snstoreId=http://lspre-snxd.cnsuning.com/activity/getCoupon.html?actCode:Edduw7"><img src="//uimgpre.cnsuning.com/uimg/cms/img/147460063032849318.jpg" alt="广告5"></a>
          </div>
          <div class="swiper-slide">
            <a href="http://m.suning.com?snstoreTypeCode=1002&amp;extId=0_0&amp;snstoreId=http://lspre-snxd.cnsuning.com/activity/getCoupon.html?actCode:Edduw7"><img src="//uimgpre.cnsuning.com/uimg/cms/img/147460063032849318.jpg" alt="广告5"></a>
          </div>
          <div class="swiper-slide">
            <a href="http://m.suning.com?snstoreTypeCode=1002&amp;extId=0_0&amp;snstoreId=http://lspre-snxd.cnsuning.com/activity/getCoupon.html?actCode:Edduw7"><img src="//uimgpre.cnsuning.com/uimg/cms/img/147460063032849318.jpg" alt="广告5"></a>
          </div>
      </div>
      <!-- Add Pagination -->
      <div class="swiper-pagination"></div>
    </div>
</template>
<script>

  export default {
    components: {

    },
    mounted () {
      this.$nextTick(() => {
        this.render()
        //this.xwidth = '100%'
      })
    },
    methods: {
      render () {
        var loadSwiper = setInterval(()=>{
          if (typeof Swiper != 'undefined') {
            clearInterval(loadSwiper);
            this.swiper = new Swiper(this.$el, {
              pagination: '.swiper-pagination',
              paginationClickable: true,
              loop: true,
              autoplay : 3000
            });
          }
        },500)
      },
    }
  }
</script>

<style lang="less" scoped>
  .swiper-container {
      width: 100%;
      height: 100%;
  }
  .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
  }
</style>
